<template>
	<view class="container">
		<view class="head-title-wapper padding15 bottom-underline">
			<view class="title">{{detailData.noticeTitle}}</view>
			<view class="time">{{detailData.noticeCD}}</view>
		</view>
		<rich-text :nodes="htmlCont"></rich-text>
		<!-- <view class="html-wapper" v-html="htmlCont"></view> -->
	</view>
</template>
 
<script>
	import { noticeModule } from '../../../modules/notice.js';
	import util from "../../../utils/util.js"
	
	const Notice = new noticeModule()
	export default {
		data() {
			return {
				detailData:{}  
			};
		},
		computed:{
			htmlCont() {
				if(this.detailData['noticeDetails']){
					const cont = this.detailData.noticeDetails
					return cont.replace(/\<img/gi,   '<img class="rich-img" ' ) // 处理富文本里的图片宽度问题
				}
			}
		},
		onLoad(e) {
			const id = e.id
			console.log(e.type)
			uni.setNavigationBarTitle({
				title: `${e.type}详情`
			})
			Notice.getNoticeDetails(id).then((res)=> {
				
				this.detailData = res
			})
		}
	}
</script>

<style lang="scss">
	@import "../../../common/scss/common.scss";
	
	.container{
		padding: ws(15);
		width: 100%;
		box-sizing: border-box;
	}
	.head-title-wapper {
		margin-bottom: ws(15);
		padding-bottom: ws(15);
		border-bottom: 1upx solid #eee;
	    .title {
	        font-size: ws(24);
	        line-height: ws(30);
	        word-break: break-all;
	    }
	    .time {
	        margin-top: ws(5);
	        font-size: ws(12);
	        color: #999;
	    }
	}
	.rich-img {
		max-width: 100% !important;
		height: auto !important;
		margin-bottom: ws(5);
	}
	
</style>
